<template>
  <div class="app-container order">
    <el-tabs v-model="activeName" @tab-click="handleClick" type="border-card">
      <el-tab-pane label="我的待办" name="todo">
        <workOrder msgType="0" ref="toDoOrder"></workOrder>
      </el-tab-pane>
      <el-tab-pane label="我的已办" name="do">
        <workOrder msgType="1" ref="doOrder"></workOrder>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import workOrder from "./workOrder.vue";

export default {
  name: 'WorkOrderIndex',
  components: {
    workOrder
  },
  data() {
    return {
      activeName: 'todo'
    }
  },
  methods:{
    handleClick(e) {
      e.name === 'do' ? this.$refs.doOrder.adjustHeight() : this.$refs.toDoOrder.adjustHeight();
    }
  }
}
</script>
<style scoped>
::v-deep .el-tabs__header{
  margin: 0;
}
::v-deep .el-tabs__item {
  font-size: 16px;
  font-weight: 600;
  color:rgba(0,0,0,0.6);
}
</style>
